<template>
	<view class="login">
		<image class="logo" :src="logo"></image>
		<text class="txt1">申请获取以下权限</text>
		<text class="txt2">获取你的登录信息</text>
		<u-button @click="loginWx" :custom-style="btnStyle">授权登录</u-button>
		<text class="txt3" @click="goBack">暂不登录</text>
	</view>
</template>

<script>
import { http } from '@/utils/http';
import { postLoginAPI, postLoginWxMinAPI, postLoginWxMinSimpleAPI } from '@/services/login';

export default {
	data() {
		return {
			btnStyle: {
				color: "#fff",
				backgroundColor: '#333333'
			},
			logo: "",
		};
	},
	onLoad() {
		this.getSysInfo();
	},
	methods: {
		goBack() {
			uni.reLaunch({
				url: '/pages/index/index'
			});
		},
		getSysInfo() {
			http({ method: 'GET', url: '/system/config' }).then(res => {
				console.log('login success with code:',  res.logo)
				if (res.code == 0) {
					this.logo = res.logo;
				}
			})
		},

		async loginWx() {
			uni.showLoading({
				mask: true,
				title: '正在登录中'
			});
			var that = this;
			let code = await this.getLoginCode() 
			console.log('login success with code:', code)
			http({ method: 'post', url: '/user/miniWxlogin', data: { code: code } }).then(res => {
				if (res.code === 0) {
					uni.setStorageSync("hasLogin", true);
					uni.setStorageSync("token", res.token);
					uni.setStorageSync("user", "momo");
					that.getUserInfo();
					uni.switchTab({
						url: '/pages/index/index'
					});
				}
				uni.hideLoading();
			})
		},
		getUserInfo() {
			http({ method: 'GET', url: '/user/userInfo' }).then(res => {
				uni.setStorageSync("userInfo", res.result)
			})
		},
		getLoginCode() {
			return new Promise((resolve, reject) => {
				uni.login({
					provider: 'weixin',
					success: function (loginRes) {
						if (loginRes.code) {
							resolve(loginRes.code);
						} else {
							console.info('未获取到登录凭证')
							reject(new Error('未获取到登录凭证'))
						}
					},
					fail: function (err) {
						console.info('LOGIN wx fail')
						reject(err);
					}

				});
			});
		},


	}
}
</script>

<style lang="scss">
.login {
	display: flex;
	flex-direction: column;
	padding: 100rpx;
}

.login .logo {
	width: 230rpx;
	height: 230rpx;
	margin: 50rpx auto;
}

.login .txt1 {
	margin-bottom: 10rpx;
}

.login .txt2 {
	color: #999;
	margin-bottom: 50rpx;
}

.login .txt3 {
	color: #8c8c8c;
	margin-top: 30rpx;
	text-align: center;
}
</style>